// 定义一个Vue插件：插件的本质就是对象，对象中需要有一个install方法
// 针对Vue进行扩展

export default {
  install (Vue, options) {
    console.log(options)
    // 形参是Vue构造函数
    Vue.prototype.$abc = 123

    // 扩展一个全局指令(当正常的图片加载失败时，显示默认图片)
    Vue.directive('imgerror', {
      inserted (el, bindings) {
        // el表示绑定该指令的DOM元素
        // bindings表示指令相关的信息 bindings.value
        // v-imgerror='a.png'
        // console.dir(bindings)
        // 如何判断图片加载失败了？基于img标签的onerror事件
        el.onerror = () => {
          // 需要给图片标签赋值一个默认的图片路径
          // 如果 bindings.value 值存在就用它，否则使用 options.default 值
          el.setAttribute('src', bindings.value || options.default)
        }
      }
    })
  }
}
